<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
    		<div class="main-content">
					<div class="breadcrumbs" id="breadcrumbs">
						<script type="text/javascript">
							try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
						</script>

						<ul class="breadcrumb">
							<li>
								<i class="icon-home home-icon"></i>
								<a href="#">首页</a>
							</li>

							<li>
								<a href="#">账号设置</a>
							</li>
							<li class="active">个人资料</li>
						</ul><!-- .breadcrumb -->
						
					</div>

					<div class="page-content">
						<div class="page-header">
							<h1>
								账号设置
								<small>
									<i class="icon-double-angle-right"></i>
									账户安全
								</small>
							</h1>
						</div><!-- /.page-header -->

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->



								<div>
									
                                <div id="user-profile-3" class="user-profile row">
										<div class="col-sm-offset-1 col-sm-10">
											<div class="well well-sm">
												<button type="button" class="close" data-dismiss="alert">&times;</button>
												&nbsp;
												<div class="inline middle blue bigger-110"> 您的资料完善程度为70% </div>

												&nbsp; &nbsp; &nbsp;
												<div style="width:200px;" data-percent="70%" class="inline middle no-margin progress progress-striped active">
													<div class="progress-bar progress-bar-success" style="width:70%"></div>
												</div>
											</div><!-- /well -->

											<div class="space"></div>

											
												<div class="tabbable">
													<ul class="nav nav-tabs padding-16">
														<li class="active">
															<a data-toggle="tab" href="#edit-basic">
																<i class="green icon-edit bigger-125"></i>
																基本信息
															</a>
														</li>

														<li>
															<a data-toggle="tab" href="#edit-password">
																<i class="blue icon-key bigger-125"></i>
																密码修改
															</a>
														</li>
														
														<li>
															<a data-toggle="tab" href="#edit-phone">
																<i class="blue icon-phone bigger-125"></i>
																手机绑定
															</a>
														</li>
														
														<li>
															<a data-toggle="tab" href="#edit-email">
															<i class="blue icon-envelope bigger-125"></i>
																邮箱验证 
															</a>
														</li>
													</ul>

													<div class="tab-content profile-edit-tab-content">
													
														<div id="edit-basic" class="tab-pane in active">
														<form class="form-horizontal user_data_submit" enctype="multipart/form-data">
															<h4 class="header blue bolder smaller">个人信息</h4>
															<div class="row">
																<div class="col-xs-12 col-sm-4">
																	<input type="file" name="user_photo_file" id = "user_photo_file"/>
																</div>

																<div class="vspace-xs"></div>

																<div class="col-xs-12 col-sm-8">
																	<div class="form-group">
																		<label class="col-sm-4 control-label no-padding-right" for="form-field-username">用户名</label>

																		<div class="col-sm-8">
																			<input class="col-xs-12 col-sm-10" type="text" name="nickname" id="form-field-username" placeholder="昵称" value="" />
																		</div>
																	</div>


																	<div class="space-4"></div>

																	<div class="form-group">
																		<label class="col-sm-4 control-label no-padding-right" for="form-hobby-first">爱好</label>

																		<div class="col-sm-8">
																			<input class="col-xs-8 col-sm-6" type="text" name="hobby" id="form-hobby-first" placeholder="爱好" value="" />
																		</div>
																	</div>
																	
																														<div class="space-4"></div>

																	<div class="form-group">
																		<label class="col-sm-4 control-label no-padding-right" for="form-place-first">所在地</label>

																		<div class="col-sm-8">
																			<input class="col-xs-8 col-sm-6" type="text" name="address" id="form-place-first" placeholder="籍贯" value="" />
																		</div>
																	</div>
																</div>
															</div>

															<hr />
															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-date">生日</label>

																<div class="col-sm-9">
																	<div class="input-medium">
																		<div class="input-group">
																			<input class="input-medium date-picker" name="birthday" id="form-field-date" type="text" data-date-format="yyyy-mm-dd" placeholder="年-月-日" />
																			<span class="input-group-addon">
																				<i class="icon-calendar"></i>
																			</span>
																		</div>
																	</div>
																</div>
															</div>

															<div class="space-4"></div>

															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right">性别</label>

																<div class="col-sm-9">
																	<label class="inline">
																		<input name="sex" id="man" type="radio" class="ace" value="男" />
																		<span class="lbl"> 男</span>
																	</label>

																	&nbsp; &nbsp; &nbsp;
																	<label class="inline">
																		<input name="sex" id="woman" type="radio" class="ace" value="女" />
																		<span class="lbl"> 女</span>
																	</label>
																</div>
															</div>

															<div class="space-4"></div>

															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-comment">个人简介</label>

																<div class="col-sm-9">
																	<textarea id="form-field-comment" name="personal_profile" rows="7" cols="50" maxlength="100" placeholder="请介绍自己...(长度不超过100字)"></textarea>

																</div>
															</div>


															

															<div class="space"></div>
															<h4 class="header blue bolder smaller">社交</h4>

															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-qq">QQ</label>

																<div class="col-sm-9">
																	<span>
																		<input type="text" name="qq" value="" id="form-field-qq" />
																	</span>
																</div>
															</div>
															<div class="clearfix form-actions">
													<div class="col-md-offset-3 col-md-9">
														<button class="btn btn-info user_information_edit_save" type="button">
															<i class="icon-ok bigger-110"></i>
															保存
														</button>

														&nbsp; &nbsp;
														<button class="btn user_information_edit_reset" type="reset">
															<i class="icon-undo bigger-110"></i>
															重置
														</button>
													</div>
												</div>
                                                                 </form>
																					</div>


														<div id="edit-password" class="tab-pane">
														<form class="form-horizontal">
															<div class="space-10"></div>

															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-pass1">旧密码</label>

																<div class="col-sm-9">
																	<input type="password" id="form-field-pass1" placeholder="原密码"/>
																</div>
															</div>
															
															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-pass2">新密码</label>

																<div class="col-sm-9">
																	<input type="password" id="form-field-pass2" placeholder="长度大于7的字母数字串"/>
																</div>
															</div>

															<div class="space-4"></div>

															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-pass3">确认密码</label>

																<div class="col-sm-9">
																	<input type="password" id="form-field-pass3" />
																</div>
															</div>
															<div class="clearfix form-actions">
													<div class="col-md-offset-3 col-md-9">
														<button class="btn btn-info password_modify" type="button">
															<i class="icon-ok bigger-110"></i>
															保存
														</button>

														&nbsp; &nbsp;
														<button class="btn" type="reset">
															<i class="icon-undo bigger-110"></i>
															重置
														</button>
													</div>
												</div>
															</form>
														</div>
														
														
														<div id="edit-phone" class="tab-pane">
														<form class="form-horizontal">
															<div class="space-10"></div>


                                                    <div class="form-group">
									                  
																<label class="col-sm-3 control-label no-padding-right" for="form-fielded-phone">已绑定手机</label>
																<div class="col-sm-9" style="margin-top:5px;">
																	<span id="binded_phone"></span>
																</div>
																</div>
                                                
									                    <div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-phone">绑定手机</label>
																<div class="col-sm-9">
																	<span class="input-icon input-icon-right">
																		<input type="text" id="form-field-phone" value="" />
																		<i class="icon-phone icon-flip-horizontal"></i>
																	</span>
																	<button class="btn btn-white" type="button" id="send_msg">
															<i class="icon-undo bigger-110"></i>
															发送验证码
														            </button>
														            
																</div>
																</div>
																<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="verification">验证码</label>
														           <div class="col-sm-9">
														            <input type="text" id="verification" value="" />
                                                                       <i class="icon-ok bigger-110 hidden"></i>
                                                                       <i class="icon-remove bigger-110 hidden"></i>
														            </div>
														            
														           
															</div>

															<div class="space-4"></div>
															<div class="clearfix form-actions">
													<div class="col-md-offset-3 col-md-9">
														<button class="btn btn-info" type="button" id="save_phone">
															<i class="icon-ok bigger-110"></i>
															保存
														</button>

														&nbsp; &nbsp;
														<button class="btn" type="reset">
															<i class="icon-undo bigger-110"></i>
															重置
														</button>
													</div>
												</div>
                                                    </form>
														</div>
														
														
														
														<div id="edit-email" class="tab-pane">
														<form class="form-horizontal">
															<div class="space-10"></div>


                                                      <div class="form-group">
									                  
																<label class="col-sm-3 control-label no-padding-right" for="form-fielded-phone">已绑定邮箱</label>
																<div class="col-sm-9" style="margin-top:5px;">
																	<span id="binded_email"></span>
																</div>
																</div>
															<div class="form-group">
																<label class="col-sm-3 control-label no-padding-right" for="form-field-email">邮箱</label>

																<div class="col-sm-9">
																	<span class="input-icon input-icon-right">
																		<input type="email" id="form-field-email" value="" />
																		<i class="icon-envelope"></i>
																	</span>
																	<button class="btn btn-white" type="button">
															<i class="icon-ok bigger-110"></i>
															验证邮箱
														</button>
																</div>
															</div>

															<div class="space-4"></div>

							                             	</form>
														</div>
														
														
														
													</div>
												</div>

												
											
										</div><!-- /span -->
									</div><!-- /user-profile -->
								</div>
								
								<!-- PAGE CONTENT ENDS -->
							</div><!-- /.col -->
						</div><!-- /.row -->
					</div><!-- /.page-content -->
				</div><!-- /.main-content -->
				
				
			<div style="color: #f4696b;z-index:20;left:50%;top:300px;position:absolute;display:none" class="la-ball-atom la-2x">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>	